<template>
<div>
  <el-row>
    <el-col :span="24">
      <div class="head-wrap" style="display:flex;" >  
                 <div style="display:flex;width:170px;align-items: center;">
                    <img src="@/assets/images/login_bg2.png" style="width:31px;height:31px;"/>
                    <div style="margin-left:10px;font-weight: bold;color: #344563;">蜂盈优品</div>
                  </div>   
                 <div style="flex:1;">                  
                        <breadcrumb style="margin-top:25px;"></breadcrumb>
                 </div>
                 <div class="close_box" style="padding-left:100px;">  
                        <!-- <div>
                          <span v-if="$store.state.my_static == 'super'">超级管理员</span>
                          <span v-if="$store.state.my_static == 'operate'">运营</span>
                          <span v-if="$store.state.my_static == 'service'">客服</span>
                          <span v-if="$store.state.my_static == 'finance'">财务</span>
                        </div> -->
                        <!-- <div style="padding:0px 15px;"><i class="el-icon-setting"></i></div> -->
                        <div>
                            <img src="@/assets/images/a7.png" style="width:32px;height:32px;margin-right:8px;margin-top:5px;"/>
                        </div>
                        <el-dropdown @command="handleCommand" trigger="click">
                          <div style="display: flex;flex-direction: row;align-items: center;">
                              <div style="height:60px;display: flex;flex-direction: column;justify-content: center;">
                                <div style="color: #344563;font-size:14px;">{{$store.state.my_username}}</div>
                                <div style="color: #8491A9;font-size:12px;margin-top:1px;">
                                  <span v-if="$store.state.my_static == 'super'">超级管理员</span>
                                  <span v-if="$store.state.my_static == 'operate'">运营</span>
                                  <span v-if="$store.state.my_static == 'service'">客服</span>
                                  <span v-if="$store.state.my_static == 'finance'">财务</span>
                                </div>
                              </div>
                                <span class="el-dropdown-link">
                                  <!-- {{$store.state.my_username}} -->
                                  <i class="el-icon-caret-bottom el-icon-caret-top"></i>
                                </span>
                          </div>
                       
                        <el-dropdown-menu slot="dropdown">
                          <el-dropdown-item icon="el-icon-switch-button" command="a">退出</el-dropdown-item>
                          <el-dropdown-item icon="el-icon-edit" command="b">二级密码</el-dropdown-item>
                        </el-dropdown-menu>
                      </el-dropdown>
                 </div>
             
           
      </div>
    </el-col>
  </el-row>

    <el-dialog title="修改二级密码" :visible.sync="user_test.user_mtk"  width="400px" >
          <el-form ref="form" :model="user_test"  label-width="100px" style="width:100%;">
                <el-form-item label="" label-width="0px">
                    <el-input v-model="user_test.password" placeholder="请输入新二级密码" ></el-input>
                </el-form-item>
                <el-form-item label="" label-width="0px" >
                    <div style="display:flex;">
                        <el-input v-model="user_test.phone" placeholder="手机验证码" style="flex:1;"></el-input>
                         <el-button class="code_but1 custom_color_button" type="primary"  @click="getCode_yz()" :disabled="user_test.disabled" style="margin-left:10px;">
                          {{ user_test.codeText }}
                        </el-button>
                    </div>
                </el-form-item>
                <div style="text-align: center;width:50%;margin:auto;margin-top:20px;">
                  <el-button type="primary" class="custom_color_button" style="width:100%;" @click="ej_mtk_but">确认</el-button>
                </div>
         </el-form>
   </el-dialog> 

 

</div>  
</template>

<script>
import Breadcrumb from '@/components/Tab/Breadcrumb'
import Tabs from '@/components/Tab/Tab'
export default {
  name: 'login',
  data () {
    return {
        user_test:{  //用户判定
            user_mtk:false, //用户判定模态狂
            codeText:'获取验证码', //获取验证码字
            totalTime:60,  //获取验证码秒
            disabled:false, //禁用获取验证码
            password:'', //二级密码
            phone:'',  //验证码
        },
    }
  },
  components:{
     Breadcrumb,
     Tabs
  },
  methods: {
     close_tc(){
        this.post("/account/logout", {
				
	    	}).then(res => {
          // console.log(res)
            if(res.error_code == 0){
             
              this.open1(res.result,'success')  //提示框

              // localStorage.setItem('my_token_fen','')
               sessionStorage.setItem("session_token",'')

              this.$router.push('/login') 
            }else{

              this.open1(res.message,'warning')  //提示框

            }
         
        })
     },
     getCode_a(){
        let than =this
       if(this.user_test.password == ''){
               this.open1('请输入新二级密码','warning')   
       }else{
          this.post("/account/getSmsCodeForCheck", {
            }).then(res => {

                this.open1('发送成功','success')   
                than.disabled = true
                var codeText = this.user_test.codeText
                var clock = setInterval(function() {
                than.user_test.totalTime--
                than.user_test.codeText = than.user_test.totalTime + 's'
                if (than.user_test.totalTime == 1) {
                    clearInterval(clock);
                    than.user_test.codeText = codeText
                    than.user_test.totalTime = 60
                    than.user_test.disabled = false
                }
                }, 1000)

          })
       }
        
     },
    ej_mtk_but(){

         this.post("/account/checkSmsCodeForCheck", {
            smscode:this.user_test.phone
         }).then(res => {
  
          if(res.error_code == 0){
  
              if(res.result == true){

                  this.post("/account/resetSafePwd", {
                        password:this.user_test.password
                  }).then(res => {
                       if(res.error_code == 0){
                          this.open1(res.result,'success')  //提示框
                          this.user_test.user_mtk = false
                        }else {
                           this.open1(res.message,'warning')
                        }
                  })

              }else if(res.result == false){
                this.open1('验证码不正确','warning')  //提示框
              }
           
          }else {
            this.open1(res.message,'warning')
          }

         })
    },
      handleCommand(command) {
         console.log(command)
        if(command == 'a'){
            this.close_tc()
        }else if(command == 'b'){
            this.user_test.user_mtk = true
        }
        
      }

  }
}
</script>

<style scoped>
.header-con{
  text-align: center;
}
.header-right{
  text-align: right;
}
.close_box{
  display:flex;
  align-items: center;
}

</style>